/**
 * @description 
 * @author cq
 * @Date 2021-04-13 10:35:55
 * @LastEditTime 2021-04-13 11:28:55
 * @LastEditors cq
 */
import React, { createElement, Component } from 'react'
import RouterContext from "./RouterContext"
import matchPath from "./matchPath";


export default class Route extends Component {
  render() {
    return (
      <RouterContext.Consumer>
        {
          context => {
            const { location } = context;
            const { path, children, component, render, computedMatch } = this.props;
            const match = computedMatch
              ? computedMatch
              : path
                ? matchPath(location.pathname, this.props)
                : context.match; // location.pathname === path;
            // const match = path
            //   ? matchPath(location.pathname, this.props)
            //   : context.match; // location.pathname === path;

            const props = {
              ...context,
              location,
              match
            };
            console.log(match, "match");
            //match children, component, render, null
            // 不match children(function), null

            // ()
            // return createElement(this.props.component)
            // 修改了match重新订阅一下
            return <RouterContext.Provider value={props}>
              {match ?
                children
                  ? typeof children === "function"
                    ? children(props)
                    : children
                  : component
                    ? createElement(this.props.component, props)
                    : render
                      ? render(props)
                      : null
                : null}
            </RouterContext.Provider>
          }
        }
      </RouterContext.Consumer>
    )
  }
}

